<script type="text/javascript" src="/{$#app_name}/FCKeditor/fckeditor.js"></script>
    <script language="Javascript">
// Gets a element by its Id. Used for shorter coding.
function GetE( elementId )
{
	return document.getElementById( elementId )  ;
}

function SetAttribute( element, attName, attValue )
{
	if ( attValue == null || attValue.length == 0 )
		element.removeAttribute( attName, 0 ) ;			// 0 : Case Insensitive
	else
		element.setAttribute( attName, attValue, 0 ) ;	// 0 : Case Insensitive
}

      function check() {
	 	document.ArticleForm.counter.value = document.ArticleForm.summary.value.length;
	 	setTimeout('check()',100);
	  }

      //function initEditors()
       window.onload= function()
      {
      	initGMenu();
      	onCategoryChange();
        var BasePath  = '/{$#app_name}/FCKeditor/';
        var oDescriptionEditor = new FCKeditor( 'article_description' ) ;
        oDescriptionEditor.BasePath = BasePath;
        oDescriptionEditor.Height = 500;
        oDescriptionEditor.ReplaceTextarea();

        var oTeaserEditor = new FCKeditor( 'teaser' ) ;
        oTeaserEditor.BasePath = BasePath;
        oTeaserEditor.ReplaceTextarea() ;

        check();

      }

      var frontpage = false;  // what image to be added
      var summary = true;

      function AddSummaryImage() {
      	frontpage = false;
      	summary = true;
      	AddImage();
      }

      function AddFrontPageImage() {
      	frontpage = true;
      	summary = false;
      	AddImage();
      }

      function AddImage() {

        var width = screen.width*0.7;
		var height = screen.height*0.7;

		var iLeft = (screen.width  - width) / 2 ;
        var iTop  = (screen.height - height) / 2 ;

        var sOptions = "toolbar=no,status=no,resizable=yes,dependent=yes" ;
		sOptions += ",width=" + width  ;
		sOptions += ",height=" + height ;
		sOptions += ",left=" + iLeft ;
		sOptions += ",top=" + iTop ;

		var path = '/{$#app_name}/FCKeditor/editor/filemanager/browser/default/browser.html?Type=Image&Connector=connectors/php/connector.php';

		window.open(path, "FCKBrowseWindow", sOptions ) ;

      }

      function SetUrl( fileUrl ) {
      		if (summary) {
          		document.forms[0].small_picture.value=fileUrl;
          		var picture = GetE('img_picture_url');
          		if (picture) SetAttribute( picture, 'src', fileUrl );
            	var size_element =  GetE('size');
          		if (size_element) size_element.style.visibility = 'hidden';
          	} else if (frontpage) {
                document.forms[0].front_picture.value=fileUrl;
          		var picture = GetE('img_frontpicture_url');
          		if (picture) SetAttribute( picture, 'src', fileUrl );
            	var size_element =  GetE('front_size');
          		if (size_element) size_element.style.visibility = 'hidden';

          	}
      }

</script>


<SCRIPT language="javascript" src="/{$#app_name}/include/zts_picker.js"></SCRIPT>
<script language="javascript">
    function showShowDateCalendar() {
        var day = document.ArticleForm.show_day.value;
        var month = document.ArticleForm.show_month.selectedIndex;
        var year = document.ArticleForm.show_year.value;
        var dt = new Date();
    	if (day>=1 && month>=1 && year>=2000) dt = new Date(year,month-1,day);
    	var str_dt = dt2dtstr(dt);
    	//alert(str_dt);
    	show_calendar('setShowDate',str_dt);
    }
	function setShowDate(str_dt) {
			//alert(str_dt);
			var dt_datetime = (str_dt == null || str_dt =="" ?  new Date() : str2dt(str_dt));
			var month = dt_datetime.getMonth()+1;
			//alert(month);
			var day = dt_datetime.getDate();
            var year = dt_datetime.getYear();
            //alert(day);
            document.ArticleForm.show_day.value = day;
            document.ArticleForm.show_year.value = year;
            document.ArticleForm.show_month.selectedIndex = month;
	}



</SCRIPT>

<core:optional for="author_user">
<script language="Javascript">
// populate array with category permissions
<list:LIST id='permissions'>
 var permissions = new Array();
<list:ITEM>
   permissions[{$category_id}] =  {$premium_show};
</list:ITEM>
</list:LIST>

function onCategoryChange() {


	var categoryE = GetE('category_id');
	var warningE =  GetE('warning');
	var premiumE =  GetE('premium');
    var premiumLabelE =  GetE('premium_label');
    var premiumCellE =  GetE('premium_cell');

    var index = -1;
    if ( categoryE ) index =  categoryE.selectedIndex;
    var category_id =  -1;
    if (index >= 0) category_id = categoryE.options[index].value;
    var permission = 0;
    if ( category_id>=0 && permissions ) permission = permissions[category_id];
    //alert('category = ' + category_id + ' permission ' +  permission);
    if ( permission==1 ) {
        //alert('Trying to allow' + permission);
    	if (warningE) warningE.style.visibility = 'hidden';
        if (premiumE) premiumE.disabled = false;
        if (premiumLabelE) premiumLabelE.className = 'enabled';
        if (premiumCellE) premiumCellE.className = 'form_label';
    } else {
        if (warningE) warningE.style.visibility = 'visible';
        if (premiumE) premiumE.disabled = true;
        if (premiumE) premiumE.checked = false;
        if (premiumLabelE) premiumLabelE.className = 'disabled';
        if (premiumCellE) premiumCellE.className = 'form_label_disabled';
    }


}

</script>
</core:optional>

<core:default for="author_user">
<script language="Javascript">
	function onCategoryChange() {
	}
</script>
</core:default>

<form id="ArticleForm" name="ArticleForm" method="post" action="" runat="server">
<input name="article_id" type="hidden" id="article_id" runat="server">
<input name="page" type="hidden" id="page" runat="server">
<hr>
<core:optional for="msg">
	<span class="message" runat="server"> {$msg} </span>
</core:optional>
<table width="100%" border="0" align="center" cellspacing="2" cellpadding="3">
<tr><td colspan="2" class="textlogin" style="font-size:10pt;left-pedding:20;padding-bottom:5;">Note: Fields marked with asterick (<font color="red">*</font>) are obligatory</td></tr>
    <tr align="left">
    	<td class="whiteheader_center">
    		<core:optional for="article_id">
    			Edit the article (ID: {$article_id})
            </core:optional>
            <core:default for="article_id">
            	Create a new article
            </core:default>
         </td>
         <td class="whiteheader">
            <a href="/{$#app_name}/myprofile/index.htm"> My Profile </a> &nbsp;
           	<html:link url="/">All articles </html:link>
          </td>
     </tr>

    <core:default for="supress_errors">
    <ERRORSUMMARY id='Summary' runat="server">
        <tr valign="top">
          <td width="{$#width}">Errors: &nbsp;</td>
          <td class="left">
          	<FONT COLOR="RED">
          		<list:ITEM> {$ErrorMessage} &nbsp; </list:ITEM>
          	</FONT>
          </td>
        </tr>
     </ERRORSUMMARY>
     </core:default>

     <tr>
     	<td class="small" colspan="2">
     		<core:optional for="article_id">
     			Enter your changes to the information below to edit an existing content item.
     			When you are finished, press the Save button.
            </core:optional>
     	</td>
     </tr>

     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="category_id" runat="server">Sport category</label>
       </td>
       <td class="form_field">
      	 <select name='category_id' id='category_id' onchange="onCategoryChange();" runat="server">
	 	 </select>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="category2_id" runat="server">Community category</label>
       </td>
       <td class="form_field">
      	 <select name='category2_id' id='category2_id' runat="server">
	 	 </select>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="headline" runat="server"><font color="red">*</font>Headline</label>
       </td>
       <td class="form_field">
         <input name="headline" type="text" id="headline" size="50" runat="server">
         <span class="small"> 50 characters limit </span>
       </td>
     </tr>

     <core:optional for="article_id">
     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="date_added" runat="server">Date Posted:</label>
       </td>
       <td class="form_field">
         <span class="small"> {$date_added} </span>
       </td>
     </tr>
     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="author" runat="server">Author:</label>
       </td>
       <td class="form_field">
         <span class="small"> {$author_show} </span>
       </td>
     </tr>
     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="url" runat="server">URL:</label>
       </td>
       <td class="form_field">
         <span class="small"> {$public_url} </span>
       </td>
     </tr>
     </core:optional>

     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="date_show" runat="server">Date to show:</label>
       </td>
       <td class="form_field">
         <input name="show_day" type="text" id="show_day" size="2" runat="server">
         <select name="show_month" id="show_month" runat="server">
         </select>
         <input name="show_year" type="text" id="show_year" size="4" runat="server">
         <a href="javascript:showShowDateCalendar();">
           <img height=20  src="/{$#app_name}/images/calendar.gif" width=20 border=0 >
         </a>
       </td>
     </tr>


     <core:optional for="staff_user">
     <tr valign="top">
       <td id="creation_cell" name="creation_cell" class="form_label" width="{$#width}">
      	 <label id="creation_label" name="creation_label" for="creation" runat="server">Creation Date:</label>
       </td>
       <td class="form_field">
         <input name="creation" type="checkbox" id="creation" value="1" runat="server">
         	Use 'Date To Show' as a 'Creation Date'
       </td>
     </tr>
     </core:optional>


     <core:optional for="staff_user">
     <tr valign="top">
       <td id="premium_cell" name="premium_cell" class="form_label" width="{$#width}">
      	 <label id="premium_label" name="premium_label" for="premium" runat="server">Premium content</label>
       </td>
       <td class="form_field">
         <input name="premium" type="checkbox" id="premium" value="1" runat="server">
         <div id="warning" name="warning" style="visibility:hidden">
         	You are not allowed to post premium article in this category
         </div>
       </td>
     </tr>
     </core:optional>

     <core:optional for="staff_user">
     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="published" runat="server">Approved/Published</label>
       </td>
       <td class="form_field">
         <input name="published" type="checkbox" id="published" value="1" runat="server">
       </td>
     </tr>
     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="add_banner" runat="server">Add banner ad in the end of the article</label>
       </td>
       <td class="form_field">
         <input name="add_banner" type="checkbox" id="add_banner" value="1" runat="server">
       </td>
     </tr>
     </core:optional>

     <core:optional for="admin_user">
     <tr valign="top">
       <td class="form_label" width="{$#width}">
          <label for="form_id" runat="server">Author: </label>
       </td>
       <td class="form_field">
         <select name="author_user_id" id="author_user_id" runat="server">
         </select>
       </td>
     </tr>
     </core:optional>


     <tr valign="top">
       <td class="form_label" colspan="1">
      	 <label runat="server">Text of the content</label>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_field" colspan="2">
      	 <textarea name="article_description" id="article_description" runat="server" cols="80" rows="10"></textarea>
       </td>
     </tr>


     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="summary" runat="server">
      	 	Summary

      	 </label>
       </td>
       <td class="form_field">
         <textarea name="summary" id="summary" runat="server" cols="75" rows="5"> </textarea> <br>
         <span class="small">
         	(Info typed in this box will appear on the home page)
         </span>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="add_banner" runat="server">
      	 	Summary characters:
      	 </label>
       </td>
       <td class="form_field">
         <input name="counter" type="text" id="counter" size="5"> <br>
         <span class="small">
         	We recommend a summary of about 350 characters when using a front-page photo of our recommended
         	size of 100 x 120.
         </span>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="small_picture" runat="server">
      	 	Summary picture:
      	 </label>
       </td>
       <td class="form_field">
         <table>
         <tr>
         	<td>
            	<core:optional for="small_picture">
           			<a id="a_picture_url" name="a_picture_url" href="{$small_picture_url}">
             			<img id="img_picture_url" name="img_picture_url" src="{$small_picture_url}" border="0"/>
           			</a> <br>
           			<div id="size" name="size">
           			  Size: {$photo_width}*{$photo_height} <br>
           			</div>
                </core:optional>

                <core:default for="small_picture">
                   <img id="img_picture_url" name="img_picture_url" src="{$host}/{$#app_name}/images/1x1.gif" border="0"/>
           		   <br>
                </core:default>

                <input name="small_picture" type="text" id="small_picture" runat="server" size="64">
                <BUTTON name="add_image" style="width:150;" class="form_button" onclick="AddSummaryImage();">Add/Change image</BUTTON>
                <br> <span class="small"> Use a summary picture of size no more than recommended 100 x 120 </span>
         	</td>
            <td>
            </td>
         </tr>
         </table>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_label" width="{$#width}">
      	 <label for="front_picture" runat="server">
      	 	Frontpage picture:
      	 </label>
       </td>
       <td class="form_field">
         <table>
         <tr>
         	<td>
            	<core:optional for="front_picture">
           			<a id="a_frontpicture_url" name="a_frontpicture_url" href="{$front_picture_url}">
             			<img id="img_frontpicture_url" name="img_frontpicture_url" src="{$front_picture_url}" border="0"/>
           			</a> <br>
           			<div id="front_size" name="front_size">
           			  Size: {$photofront_width}*{$photofront_height} <br>
           			</div>
                </core:optional>

                <core:default for="front_picture">
                   <img id="img_frontpicture_url" name="img_frontpicture_url" src="{$host}/{$#app_name}/images/1x1.gif" border="0"/>
           		   <br>
                </core:default>

                <input name="front_picture" type="text" id="front_picture" runat="server" size="64">
                <BUTTON name="add_frontimage" style="width:150;" class="form_button" onclick="AddFrontPageImage();">Add/Change image</BUTTON>
                <!--<br> <span class="small"> Use a summary picture of size no more than recommended 100 x 120 </span>    -->
         	</td>
            <td>
            </td>
         </tr>
         </table>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_label" colspan="1">
      	 <label runat="server">
      	 	Teaser text (Optional): <br>
      	 </label>
       </td>
     </tr>

     <tr valign="top">
       <td class="form_field" colspan="2">
      	 <textarea name="teaser" id="teaser" runat="server"></textarea> <br>
         <span class="small">
      	 		(Info typed in this box will appear to non subscribers when they click on a premium story.
      	 		If you do not enter any teaser text, your front page summary will automatically be defaulted.)
      	 </span>
       </td>
     </tr>

     <core:optional for="staff_user">
     <tr valign="top">
       <td class="form_label" width="{$#width}">
         <input name="show_form" type="checkbox" id="show_form" value="1" runat="server">
      	 <label for="form_id" runat="server">Show article feedback form</label>
       </td>
       <td class="form_field">
         <select name="form_id" id="form_id" runat="server">
         </select>
       </td>
     </tr>
     </core:optional>

     <tr>
      <td class="whiteheader_center" colspan="2">&nbsp;</td>
     </tr>

	 <tr>
      <td>&nbsp;</td>
      <td class="form_field">

      		<core:default for="article_id">
      			<input type="submit" name="create" value="Create" runat="server">
            </core:default>
            <core:optional for="article_id">
      			<input type="submit" name="save" value="Save" runat="server">
                <!--<input type="submit" name="delete" value="Delete" runat="server">-->
            </core:optional>
            <input type="submit" name="clean" value="Clean" runat="server">
            <input type="submit" name="articles" value="Back to articles" runat="server">
            <core:optional for="article_id">
                <br>
                <a href="/{$#app_name}/pub.article.php?article_id={$article_id}" target="__blank">
                  Preview
                </a>
                <span class="small">
                	Before hitting Preview, make sure that you saved the article information
      	 		</span>
            </core:optional>
      </td>
</tr>

</table>
</form>

<!--<script type="text/javascript" language="Javascript">
	initEditors();
</script>-->